import React, { useState } from 'react';
import { Tree } from 'antd';
import {
    CodepenOutlined,
    ShareAltOutlined,
    SettingOutlined,
    FileOutlined,
} from '@ant-design/icons';

const treeData = [
    {
        title: 'J000001 特斯拉Model A',
        key: 'J000001',
        icon: <CodepenOutlined />,
        children: [
            {
                title: 'P120360 电池动力机组',
                key: 'P120360',
                icon: <CodepenOutlined />,
                children: [
                    {
                        title: '10 装配',
                        key: '10001',
                        icon: <SettingOutlined />,
                        children: [
                            {
                                title: 'P150260 电磁芯片',
                                key: 'P150260',
                                icon: <FileOutlined />
                            },
                        ]
                    },
                    {
                        title: '20 调试检测',
                        key: '10002',
                        icon: <SettingOutlined />
                    },
                    {
                        title: '30 外协喷漆',
                        key: '70001',
                        icon: <ShareAltOutlined />
                    },              
                    
                ],
            },
            {
                title: 'P121580 变速箱机组',
                key: '0-0-1',
                icon: <CodepenOutlined />,
                children: [
                    {
                        title: '10 装配',
                        key: '10001-2',
                        icon: <SettingOutlined />
                    },
                    {
                        title: '20 调试检测',
                        key: '10002-2',
                        icon: <SettingOutlined />
                    },
                    {
                        title: '30 包装',
                        key: '70001-2',
                        icon: <SettingOutlined />
                    },
                ],
            },
            {
                title: 'P150240 钢化玻璃',
                key: 'P150240',
                icon: <FileOutlined />
            },
        ],
    },
];

class BomTree extends React.Component {
    render() {
        const onExpand = expandedKeys => {
            console.log('onExpand', expandedKeys);
        };

        const onCheck = checkedKeys => {
            console.log('onCheck', checkedKeys);
        };

        const onSelect = (selectedKeys, info) => {
            console.log('onSelect', info);
        };
        return (
            <Tree
                showIcon
                checkable
                defaultExpandAll
                onExpand={onExpand}
                onCheck={onCheck}
                onSelect={onSelect}
                treeData={treeData}
            />
        );
    }
}
export default BomTree;